.my-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    width: 702rpx;
    margin: 20rpx auto;
    padding: 27rpx auto;
    // color: var(--text-color);

    .my {
        width: 100%;
        height: 208rpx;
        display: flex;
        align-items: center;
        flex-direction: row;

        // border:1px solid var(--text-color);
        .welcome {

            display: flex;
            flex-direction: column;
            margin-left: 20rpx;

            .hello {
                font-size: 22rpx;
                font-weight: 400;
            }

            .nick-name {
                margin-top: 10rpx;
                font-size: 40rpx;
                font-weight: 500;
            }

        }

        .avator {
            width: 128rpx;
            height: 128rpx;
            border: 1px solid white;
            border-radius: 50%;
        }
    }

    .middle {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        width: 100%;
        height: 300rpx;
        margin-top: 40rpx;

        // border:1px solid var(--text-color);

        .item {
            display: flex;
            align-items: center;
            justify-content: space-between;
            width: 100%;
            height: 90rpx;

            // border:1px solid var(--text-color);
            image {
                width: 48rpx;
                height: 48rpx;
                // border:1px solid var(--text-color);
            }

            .title {
                display: flex;
                align-items: center;

                image {
                    width: 36rpx;
                    height: 48rpx;
                    // border:1px solid var(--text-color);
                }

                text {
                    margin-left: 26rpx;
                    font-size: 34rpx;
                    font-weight: 400;
                }
            }
        }
    }

    .btn-panel {
        display: flex;
        justify-content: space-between;
        width: 620rpx;
        height: 88rpx;
        margin-top: 60rpx;
        font-size: 40rpx;

        color: var(--btn-text-color, rgb(255, 255, 255));

        .btn {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 702rpx;
            height: 88rpx;
            background-color: var(--btn-bg-color);
            border-radius: 15rpx;
        }
    }
}

.bottom-panel {
    color: #393D49;
    .photo-studio {
        height: 500rpx;

        image{
            width: 48rpx;
            height:48rpx;
            margin-right:24rpx;
            // border:1px solid red;
        }
        text {
            font-size: 34rpx;
        }
        .title-container{
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            flex:1;
            // border:1px solid red;
            .title{
                display:flex;
                flex-direction: row;
                align-items: center;
                
            }

        }
        .wxzf {
            display:flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
            height: 56rpx;
            padding:32rpx 0px;
            margin-top: 32rpx;
            // border:1px solid red;
        }

        .qtdd {
            display:flex;
            flex-direction: column;
            align-items: left;
            height: 56rpx;
            padding:16px 0px;
            // border:1px solid red;
            .order{
                display: flex;
                flex-direction: row;
                align-items: center;
                margin: 28rpx 0rpx 0rpx 0rpx;
                input{
                    border:1px solid #eeeeee;
                    margin-left:10rpx;
                    height: 56rpx;
                    flex:1;
                }
            }
        }
    }
}